<script setup lang="ts">
import {ref} from 'vue'

const showCards = ref(false);

</script>

<template>
  <div>
    <el-button type="info" class="position-1-btn" @click="showCards=true">展示</el-button>
    <el-button type="warning" class="position-2-btn" @click="showCards=false">取消</el-button>
    <el-card style="max-width: 480px" v-if="showCards">
      <template #header>行政区划专题图</template>
      <img
          src="@/assets/307F5575C1461D968AEA2E3CC099EA71.jpg"
          style="width: 400px; height: auto;"
      />
    </el-card>
  </div>
</template>

<style scoped lang="scss">
.position-1-btn {
  /* 绝对定位方式 */
  position: absolute;
  top: 450px;  /* 距离顶部？？？px */
  left: 750px; /* 距离左侧？？？px */
  /* 按钮样式 */
}
.position-2-btn {
  /* 绝对定位方式 */
  position: absolute;
  top: 450px;  /* 距离顶部？？？px */
  left: 850px; /* 距离左侧？？？px */
  /* 按钮样式 */
}
</style>